<!DOCTYPE html>
<html>
<head>
    <title>购物车</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <link rel="stylesheet" href="../lib/weui.min.css">
    <link rel="stylesheet" href="../css/jquery-weui.css">
    <link rel="stylesheet" href="../css/base.css">
    <link rel="stylesheet" href="../css/cart.css">
</head>
<body>
<div class="xyg-cart weui-cells_checkbox" id="itemList">
    <!--整个活动开始-->
    <div class="xyg-cart-list">
        <div class="xyg-cart-list-head">
            <div class="xyg-cart-list-head-checked">
                <label class="weui-cell" style="padding:14px 0px 0px 0px;">
                    <input type="checkbox" class="weui-check xyg-activity-checkbox" name="checkbox"><i
                        class="weui-icon-checked"></i>
                </label>
            </div>
            <div class="xyg-cart-list-head-title">
                自营
            </div>
        </div>
        <div id="itemListShow">
            <!--内容展示开始-->

            <!--内容展示结束-->
        </div>
    </div>
</div>
<div style="width: 100%; height: 3.2rem;"></div>
<!--底部开始-->
<div class="xyg-product-footer">
    <div class="xyg-product-footer-tab1">
        <div class="xyg-product-footer-tab-center">
            <div class="xyg-product-footer-tab xyg-product-footer-tab1-pic" onClick="goFistPage()">
                <div class="xyg-product-footer-btn">
                    <img src="../images/icon_nav_frist.png?123" class="picture" alt="">
                </div>
            </div>
        </div>
    </div>
    <div class="xyg-product-footer-tab3">
        <div class="xyg-product-footer-tab-center">
            <div class="xyg-product-footer-tab xyg-product-footer-tab3-pic">
                <div class="xyg-product-footer-btn xyg-product-footer-tab3-pic-gwc" onClick="goCartPage()">
                    <div class="xyg-product-footer-btn-top-text" id="cartNumShow">
                    </div>
                    <img src="../images/icon_gwc_3.png" class="picture-bottom" alt="">
                </div>
                <div id="showAllMoney" class="xyg-product-footer-text">
                    ￥0
                </div>
            </div>
        </div>
    </div>
    <div class="xyg-product-footer-tab2">
        <div class="xyg-product-footer-tab-center">
            <div class="xyg-product-footer-tab xyg-product-footer-tab2-pic">
                <div class="xyg-product-footer-text" id="submit">
                    去结算
                </div>
            </div>
        </div>
    </div>

    <div class="xyg-product-footer-tab4">
        <div class="xyg-product-footer-tab-center">
            <div class="xyg-product-footer-tab xyg-product-footer-tab4-pic"  onClick="delCatByIds()">
                <div class="xyg-product-footer-btn" style="line-height: 2.2rem; font-size: 0.6rem; color: #fff;">
                    清&nbsp;空
                </div>
            </div>
        </div>
    </div>
</div>
<!--底部结束-->
<script type="text/x-handlebars-template" id="item-list-temp">
    <div class="weui-cell weui-cell_swiped">
        <div class="xyg-cart-list-content weui-cell__bd">
            <div class="xyg-cart-list-content-checked">
                <label class="weui-cell" style="padding:32px 0px 0px 0px;">
                    <input type="checkbox"  class="weui-check xyg-item-checkbox" name="itemCart"
                           data-price="{{item.prePrice}}" data-paramdata="{{paramData}}" data-id="{{id}}"
                           data-specsseq="{{specsId}}" data-item="{{itemId}}">
                    <i class="weui-icon-checked"></i>
                </label>
            </div>
            <div class="xyg-cart-list-content-pic">
                <img src="{{getImgArrFirst itemImage}}" class="productDesc" >
            </div>
            <div class="xyg-cart-list-content-text">
                <div class="productDesc" >
                    <div class="xyg-cart-list-content-text-title">
                        {{itemTitle}}
                    </div>
                    <div class="xyg-cart-list-content-text-proper">
                        {{paramData}}
                    </div>
                    <div class="xyg-cart-list-content-text-pricenum">
                        <div class="xyg-cart-list-content-text-price">
                            ￥{{itemPrePrice}}
                            {{#if itemOrigPrice}}
                            <del>
                                ￥{{itemOrigPrice}}
                            </del>
                            {{/if}}
                        </div>
                        <div class="xyg-cart-list-content-text-num">
                            <div class="weui-count">
                                <a class="weui-count__btn weui-count__decrease">
                                </a>
                                <input class="weui-count__number" type="number" name="itemNum" value="{{buyNum}}"/>
                                <a class="weui-count__btn weui-count__increase">
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="xyg-cart-list-btn weui-cell__ft">
            <a class=" weui-swiped-btn_warn delete-swipeout xyg-btn" data-id="{{id}}"
               href="javascript:">
                删除
            </a>
        </div>
        <div style="width: 100%;clear: both;"></div>
    </div>
</script>
</body>
<script src="../lib/jquery-2.1.4.js"></script>
<script src="../js/jquery-weui.js"></script>
<script src="../js/swiper.min.js"></script>
<script src="../fonts/iconfont.js"></script>
<script src="../lib/fastclick.js"></script>

<script src="../lib/handlebars.min.js"></script>
<script src="../js/config.js"></script>
<script src="../js/base.js"></script>
<script>
    $(function () {
        FastClick.attach(document.body);
        $('.weui-cell_swiped').swipeout('open');
    });
</script>
<script>
    var MAX = 99, MIN = 1;
    var memberId = "";
    $(function () {
        checkLogin();
        memberId = getMemberId();
        if (!memberId){
            return false;
        }
        initLister();
        initData();
    });

    function initData() {
        // 获取购物车数
        $.get(baseURL + "api/cart/getNum/"+memberId,"",function(res) {
            if (res.code == 0 && res.count > 0) {
                $("#cartNumShow").html(res.count);
            }
        });

        $.ajaxSettings.async = false;
        $.get(baseURL + "api/cart/page", {
            size: 100,
            current: 1,
            memberId : memberId
        }, function (resultInfo) {
            if (resultInfo.data != null && resultInfo.data.length > 0) {
                for (var i = 0; i < resultInfo.data.length; i++) {
                    var item = resultInfo.data[i];
                    var itemTemp = $('#item-list-temp').html();
                    var hanItem = Handlebars.compile(itemTemp);
                    $('#itemListShow').append(hanItem(item));
                }
                $('.weui-cell_swiped').swipeout();
            }
        }, "json");
        $.ajaxSettings.async = true;

        $('.weui-count__decrease').click(function (e) {
            var $input = $(e.currentTarget).parent().find('.weui-count__number');
            var number = parseInt($input.val() || "0") - 1
            if (number < MIN) number = MIN;
            $input.val(number);
            setAllMoney();
        })
        $('.weui-count__increase').click(function (e) {
            var $input = $(e.currentTarget).parent().find('.weui-count__number');
            var number = parseInt($input.val() || "0") + 1
            if (number > MAX) number = MAX;
            $input.val(number);
            setAllMoney();
        })
    }

    function initLister(){
        $("#submit").on("click", function () {
            // 获取活动id及商品id及数量
            var arr = [];
            $("input[type='checkbox'][name='itemCart']").each(function () {
                if ($(this).is(":checked")) {
                    var obj = {};
                    // 加入
                    var id = $(this).attr("data-id");
                    var itemId = $(this).attr("data-item");
                    var specsSeq = $(this).attr("data-specsseq");
                    var paramData = $(this).attr("data-paramdata");
                    var itemNum = $(this).parent().parent().next().next().find("input[name='itemNum']").val();
                    if (parseInt(itemNum) < 1) {
                        return;
                    }
                    obj.id = id;
                    obj.itemId = itemId;
                    obj.num = itemNum;
                    obj.specsSeq = specsSeq;
                    obj.paramData = paramData;
                    arr.push(obj);
                }
            });
            if (arr.length < 1) {
                $.toast("请选择您要付款的商品", "text");
                return false;
            }
            /*if (arr.length > 1) {
             $.toast("非同款同型号商品，需分开多次单独结算", "text");
             return false;
             }*/
            var orderItemJson = encodeURI(JSON.stringify(arr));
            console.log(orderItemJson);
            window.location.href = "/mobile/view/addDetail.html?memberId=" + memberId + "&orderItemJson=" + orderItemJson + "&type=2";
        });

        $(".delete-swipeout").on("click", function () {
            var itemObj = $(this);
            $.confirm("您确定要删除该购物车商品吗？", "删除提示", function () {
                $.showLoading("正在提交中");
                $.post(baseURL + "api/cart/delete/"+itemObj.attr("data-id"), {
                    "_method": "DELETE"
                }, function (result) {
                    if (0 == result.code) {
                        $.hideLoading();
                        // itemObj.parents(".weui-cell_swiped").remove();
                        goCartPage();
                    } else {
                        $.hideLoading();
                        $.toast(result.msg, "text");
                    }
                })
            }, function () {
                //取消操作
            });
        });
    }

    Handlebars.registerHelper("getImgArrFirst",function(str) {
        if(str==null || str=="") {
            return str;
        }
        var imageArr = str.split(",");
        if(imageArr != null && imageArr.length > 0){
            return imageArr[0];
        }
        return "";
    });

    function goFistPage(){
        window.location.href="/mobile/view/index.html";
    }
    function goCartPage(){
        window.location.href="/mobile/view/cart.html";
    }

    $(document).ready(function (e) {
        var startX = 0;
        var moveEndX = 0;
        $(".xyg-activity-checkbox").bind("click", function () {
            if ($(this).is(":checked")) {
                $(this).parent().parent().parent().parent().find(".xyg-item-checkbox").prop("checked", "checked");
                ;
            } else {
                $(this).parent().parent().parent().parent().find(".xyg-item-checkbox").attr("checked", false);

            }
            setAllMoney();
        });
        $(".xyg-item-checkbox").bind("click", function () {
            var flage = true;//是否选中
            if ($(this).is(":checked")) {
                //选中
                $(this).parent().parent().parent().parent().parent().find(".xyg-item-checkbox").each(function (index, element) {
                    if (!($(element).is(":checked"))) {
                        flage = false;
                    }
                });
            } else {
                //取消
                flage = false;
            }
            if (flage) {
                $(this).parent().parent().parent().parent().parent().parent().find(".xyg-activity-checkbox").prop("checked", "checked");
            } else {
                $(this).parent().parent().parent().parent().parent().parent().find(".xyg-activity-checkbox").attr("checked", false);

            }
            setAllMoney();
        });
    });

    function setAllMoney() {
        var allMoney = 0;
        $(".xyg-item-checkbox").each(function (index, element) {
            if ($(element).is(":checked")) {
                var num = $(element).parent().parent().parent().find(".xyg-cart-list-content-text-num .weui-count__number").val();
                var price = $(element).attr("data-price");
                allMoney = allMoney * 1 + num * price * 1;
            }
        });
        $("#showAllMoney").html("￥" + allMoney);
    }

    function delCatByIds() {
        var arr = [];
        $("input[type='checkbox'][name='itemCart']").each(function () {
            if ($(this).is(":checked")) {
                var id = $(this).attr("data-id");
                arr.push(id);
            }
        });
        if (arr.length < 1) {
            $.toast("请选择您要删除的商品", "text");
            return false;
        }
        $.confirm("您确定要删除该购物车商品吗？", "删除提示", function () {
            $.showLoading("正在提交中");
            $.post(baseURL + "api/cart/delete/"+arr.join(","), {
                "_method": "DELETE"
            }, function (result) {
                if (0 == result.code) {
                    $.hideLoading();
                    goCartPage();
                } else {
                    $.hideLoading();
                    $.toast(result.msg, "text");
                }
            })
        }, function () {
            //取消操作
        });
    }
</script>
</html>

